import React, { Component } from 'react'

export default class Controlled extends Component {
  state = {
    value: ''
  }
  render() {
    const { value } = this.state
    return (
      <div>
        <h2>Controlled -- {value}</h2>
        <input
          type="text"
          value={value}
          onChange={(e) => this.handleChangeValue(e)}
        />
      </div>
    )
  }

  handleChangeValue(e) {
    // console.log(e.target.value)
    this.setState({
      value: e.target.value
    })
  }
}
